{include file="public/header"}
<!-- 列表 -->
<style>
    .layui-table img {
        max-width: none;
    }
</style>
<!-- 颜色字 -->
<style>
    .layui-bg-green,
    .layui-bg-orange {
        padding: 5px 8px;
        border-radius: 5px;
    }
</style>
<!-- 缩略图 -->
<style>
    .layui-upload-img {
        width: 100px;
        height: 100px;
        line-height: 100px;
        text-align: center;
        border: 1px solid #ccc;
    }

    .layui-upload-img img {
        max-width: 100%;
        max-height: 100%;
        margin: auto auto;
    }
</style>
</head>

<body>
    <div class="cBody">
        <div class="console">
            <a class="layui-btn" onclick="OpenView('{:url('Users/add')}','添加用户')">添加用户</a>
        </div>
        <table class="layui-table layui-form">
            <colgroup>
                <col width="50">
            </colgroup>
            <thead>
                <tr>
                    <th><input type="checkbox" id="all-checkbox" title="ID" lay-skin="primary" value=""></th>
                    <th>昵称</th>
                    <th>头像</th>
                    <th>手机号</th>
                    <th>邮箱</th>
                    <th>性别</th>
                    <th>消费积分</th>
                    <th>注册时间</th>
                    <th>最后登录时间</th>
                    <th>最后登录IP</th>
                    <th>黑名单</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody id="page-list">
            </tbody>
        </table>
        <div id="test1"></div>
    </div>
</body>
<script>
    layui.use(['form', 'layer', 'laypage', 'jquery'], function () {
        var form = layui.form;
        var layer = layui.layer;
        var laypage = layui.laypage;
        var $ = layui.$;
        form.render();
        form.on('switch(shortcuts)', function (data) {
            shortcuts('users', $(this).attr('data-id'), this.name, this, "{:url('Login/shortcuts')}");
        });
        //执行一个laypage实例
        laypage.render({
            elem: 'test1' //注意，这里的 test1 是 ID，不用加 # 号
            , count: '{$count}' //数据总数，从服务端得到
            , layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
            , jump: function (obj, first) {
                //obj包含了当前分页的所有参数，比如：
                // console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                // console.log(obj.limit); //得到每页显示的条数
                $.ajax({
                    data: { 'curr': obj.curr, 'limit': obj.limit },
                    type: 'POST',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code == 0) {
                            var html = "";
                            obj.count = res.data.count;
                            console.log(res);
                            if (res.data.data.length != 0) {
                                $.each(res.data.data, function (i, v) {
                                    if (v.head_portrait != '') {
                                        v.head_portrait = '<img src="' + v.head_portrait + '" width="20" height="20" onclick="OpenImgs(this.src)" />';
                                    } else {
                                        v.head_portrait = '暂无'
                                    }
                                    if (v.sex == '0') {
                                        v.sex = '保密';
                                    } else if (v.sex == '1') {
                                        v.sex = '男';
                                    } else {
                                        v.sex = '女';
                                    }
                                    if (v.is_black == 1) {
                                        v.is_black = '<input type="checkbox" name="is_black" data-id="' + v.id + '" lay-skin="switch" lay-text="是|否" lay-filter="shortcuts" checked>';
                                    } else {
                                        v.is_black = '<input type="checkbox" name="is_black" data-id="' + v.id + '" lay-skin="switch" lay-text="是|否" lay-filter="shortcuts">';
                                    }
                                    html = html + "<tr>" +
                                        '<td><input type="checkbox" name="ids[]" title="' + v.id + '" lay-skin="primary" value="' + v.id + '"></td>' +
                                        '<td>' + v.nickname + '</td>' +
                                        '<td>' + v.head_portrait + '</td>' +
                                        '<td>' + v.mobile + '</td>' +
                                        '<td>' + v.email + '</td>' +
                                        '<td>' + v.sex + '</td>' +
                                        '<td>' + v.pay_points + '</td>' +
                                        '<td>' + layui.laytpl.toDateString(v.add_date * 1000) + '</td>' +
                                        '<td>' + layui.laytpl.toDateString(v.last_login * 1000) + '</td>' +
                                        '<td>' + v.last_ip + '</td>' +
                                        '<td>' + v.is_black + '</td>' +
                                        '<td>' +
                                        '<a class="layui-btn layui-btn-xs edit" id="' + v.id + '">编辑</a>' +
                                        '<a class="layui-btn layui-btn-xs layui-btn-danger del"  id="' + v.id + '"> 删除</a>' +
                                        '</td>' +
                                        "</tr>";
                                });
                                $('#page-list').html(html);
                                form.render();
                            } else {
                                $('#page-list').html('<tr>无数据</tr>');
                            }

                        } else {
                            layer.msg(res.msg, {
                                icon: 2
                            });
                        }
                    },
                    error: function () {
                        layer.msg('网络出错，请联系客服!', {
                            icon: 0
                        });
                    }
                });
                //首次不执行
                if (!first) {
                    //do something
                }
            }
        });
        $('body').delegate('.edit', 'click', function () {
            var name = $(this).html();
            var id = $(this).attr('id');
            OpenView("{:url('Users/edit')}?id=" + id, name);
        });
        $('body').delegate('.del', 'click', function () {
            var id = $(this).attr('id');
            var obj = $(this).parent().parent();
            del('{:url("Users/del")}', id);
        });
    });

</script>
{include file="public/footer"}